<template>
	<view>
		<view class="questionprogress combg">
			<view class="conttop">
				<!-- <view class="conttopl">
					<u-icon name="clock" color="#00e315" size="20" class="uicon"></u-icon><text>测评需要用时：10分钟</text>
				</view> -->
				<view class="conttopr" style="display: flex;">当前：第{{capitalindex[firstfloorindex]}}部分
					(
					<view style="color:#ffc92a ;">{{secondfloorindex+1}}</view>
					/{{qdata[firstfloorindex].questiondata.length}})
				</view>
			</view>
			<view class="progress-box">
				<u-line-progress active-color="#ffc92a" :percent="secondfloorper"></u-line-progress>
			</view>
			<view class="btitle">{{qdata[firstfloorindex].title}}</view>
			<view class="progress-box">
				<u-line-progress active-color="#ffc92a" :percent="firstfloorper"></u-line-progress>
			</view>
		</view>

		<view class="questest combg">
			<view class="title">{{secondfloorindex+1}}、{{qdata[firstfloorindex].questiondata[secondfloorindex].title}}
			</view>
			<view v-if="qdata[firstfloorindex].questiondata[secondfloorindex].fxtishi" style="font-size: 20rpx;">
				{{qdata[firstfloorindex].questiondata[secondfloorindex].fxtishi}}
			</view>
			<view class="listitem" :class="[item.answerchecked?'active':'']" v-on:click="answerclick(index)"
				v-for="(item,index) in items" :key="index">
				{{index+1}}:{{ item.answertitle }}
			</view>
			<view class="texttip">{{secondfloorindex+1}}/{{qdata[firstfloorindex].questiondata.length}}</view>
		</view>

		<view class="back" v-on:click="back" v-show="firstfloorindex||secondfloorindex">
			<u-icon name="play-left-fill" color="#ffe18a" size="28" class="uicon"></u-icon><text>返回上一题</text>
		</view>
	</view>
</template>

<script>
	export default {
		name: "questions",
		data() {
			return {
				firstfloorindex: 0,
				secondfloorindex: 0,
				capitalindex: [],
				qdata: []
			}
		},
		props: {
			wqdata: {
				type: Array,
				default: []
			},
		},
		mounted() {
			let qdata = this.wqdata || []
			let endqdata = [];
			let mlaform = uni.getStorageSync("mlaform");
			qdata.forEach(item => {
				if (item.title.indexOf("高效运营") > -1) {
					if (item.title.indexOf(mlaform.sex) > -1) {
						endqdata.push(item)
					}
				} else {
					endqdata.push(item)
				}
			})

			endqdata.forEach((item, index) => {
				this.capitalindex.push(index + 1)
			});
			this.qdata = [...endqdata]
			this.$emit('update:wqdata', endqdata)
		},
		methods: {
			setindex(firstfloorindex, secondfloorindex) {
				this.firstfloorindex = firstfloorindex;
				this.secondfloorindex = secondfloorindex;
			},
			answerclick: function(index) {
				console.log("answerclick")
				var eachanswers = this.qdata[this.firstfloorindex].questiondata[this.secondfloorindex].answers;
				var havechecked = eachanswers.some(function(item) {
					return item.answerchecked == true
				});
				if (havechecked) {
					eachanswers.map(function(item) {
						item.answerchecked = false
						return item
					})
				}
				eachanswers[index].answerchecked = true;
				this.qdata[this.firstfloorindex].questiondata[this.secondfloorindex].answers[index].answerchecked =
					true;
				setTimeout(() => {
					let quanbuwancgen = this.checkwanchengquanbu();
					console.log("********checkwanchengquanbu*********", quanbuwancgen)
					if (!quanbuwancgen && this.secondfloorindex < this.qdata[this.firstfloorindex].questiondata
						.length - 1) {
						this.secondfloorindex++;
					} else if (!quanbuwancgen && this.firstfloorindex < this.qdata.length - 1) {
						this.secondfloorindex = 0, this.firstfloorindex++;
					} else {
						var group = [];
						var groupsum = [];
						var answeredqdata = this.qdata;
						for (var i = 0; i < answeredqdata.length; i++) {
							group[i] = [];
							for (var j = 0; j < answeredqdata[i].questiondata.length; j++) {

								for (var k = 0; k < answeredqdata[i].questiondata[j].answers.length; k++) {

									if (answeredqdata[i].questiondata[j].answers[k].answerchecked) {
										group[i].push(answeredqdata[i].questiondata[j].answers[k].answerscore);
									}

								}
							}
						}
						for (var i = 0; i < group.length; i++) {
							var groupeachsum = group[i].reduce((accumulator, currentValue) => accumulator +
								currentValue);
							groupsum.push(groupeachsum);
						}
						this.$emit("wancheng", this.qdata)
					}
				}, 100);
				this.$emit("update:wqdata", this.qdata)
			},
			checkwanchengquanbu() {
				let qdata = this.qdata;
				let quanbuwangcheng = false;
				let wanchengbufen = 0;
				for (let i in qdata) {
					let questiondata = qdata[i]["questiondata"];
					let yiwancheng = 0;
					questiondata.forEach(item => {
						let answers = item.answers;
						answers.forEach(answer => {
							if (answer.answerchecked) {
								yiwancheng++;
							}
						})
					})
					if (yiwancheng < questiondata.length) {
						return false;
					}
					wanchengbufen++;
				}
				if (wanchengbufen == qdata.length) {
					return true;
				}
			},
			back: function() {
				if (this.firstfloorindex > 0 && this.secondfloorindex == 0) {
					this.firstfloorindex--;
					this.secondfloorindex = this.qdata[this.firstfloorindex].questiondata.length - 1;
				} else {
					this.secondfloorindex--;
				}
			}
		},
		computed: {
			firstfloorper: function() {
				let qdata = this.qdata;
				let quanbuwangcheng = false;
				let wanchengbufen = 0;
				let zongshuliang = 0;
				let yiwancheng = 0;
				for (let i in qdata) {
					let questiondata = qdata[i]["questiondata"];
					questiondata.forEach(item => {
						let answers = item.answers;
						zongshuliang++;
						answers.forEach(answer => {

							if (answer.answerchecked) {
								yiwancheng++;
							}
						})
					})


				}

				return parseInt((((yiwancheng) / (zongshuliang)).toFixed(2) * 100));
			},
			secondfloorper: function() {
				// if (this.qdata[this.firstfloorindex] && this.qdata[this.firstfloorindex].questiondata) {
				// 	return parseInt((((this.secondfloorindex + 1) / (this.qdata[this.firstfloorindex].questiondata
				// 			.length))
				// 		.toFixed(2) * 100));
				// }
				
				let qdata = this.qdata;
				if(!qdata[this.firstfloorindex]){
					return;
				}
				let questiondata = qdata[this.firstfloorindex]["questiondata"];
				let yiwancheng = 0;
				questiondata.forEach(item => {
					let answers = item.answers;
					answers.forEach(answer => {
						if (answer.answerchecked) {
							yiwancheng++;
						}
					})
				})
				return parseInt(((yiwancheng / (this.qdata[this.firstfloorindex].questiondata
						.length))
					.toFixed(2) * 100))

			},
			items: function() {
				if (this.qdata[this.firstfloorindex] && this.qdata[this.firstfloorindex].questiondata) {
					return this.qdata[this.firstfloorindex].questiondata[this.secondfloorindex].answers;
				}

			}
		}
	}
</script>

<style scoped>
	page {
		/* background-color: #ffc92a; */
	}

	.conttop {
		display: flex;
		justify-content: space-between;
	}

	.conttopl text {
		vertical-align: middle;
		padding-left: 8rpx;
	}

	.progress-box {
		margin-top: 20rpx;
		margin-bottom: 20rpx;
	}

	.back {
		text-align: center;
	}

	.back text {
		vertical-align: middle;
		color: #7b5c00;
	}


	.questest .title {
		font-size: 32rpx;
		color: #594e3f;
		font-weight: 700;
		margin-bottom: 56rpx;
	}

	.questest .listitem {
		width: calc(100% - 80rpx);
		text-indent: 20rpx;
		padding: 20rpx 10rpx;
		/* line-height: 88rpx; */
		font-size: 28rpx;
		color: #706659;
		margin: 40rpx auto;
		background: #f5f5f7;
		border-radius: 20rpx;
		text-align: left;
	}

	.questest .listitem.active {
		background: #ffc92a;
		color: #fff;
	}


	.questest .texttip {
		font-size: 28rpx;
		color: #594e3f;
		text-align: center;
	}

	.back {
		padding-top: 30rpx;
		padding-bottom: 120rpx;
	}
</style>
